<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp" %>
<style>
    #addMetting{
        position:absolute;
        right:90px;
        display: none;
    }
    #hyjyContent .form-group{
        position:relative;
    }
    #hyjyContent .btn-danger{
        position:absolute;
        right:90px;
    }
</style>
<form:form commandName="taskNew" cssClass="form-horizontal" role="form" onsubmit="return false;">
    <div class="form-group">
        <label class="col-sm-2 control-label no-padding-right" for="taskName">任务名称</label>
        <div class="col-sm-8">
            <input type="text" name="taskName" id="taskName" placeholder="任务名称" value="${taskNew.taskName}"
                   class="form-control required">
        </div>
    </div>
    <div class="form-group" style="position: relative;">
        <label class="col-sm-2 control-label no-padding-right" for="referenceNumber">文号</label>
        <div class="col-sm-3">
            <input type="text" name="referenceNumber" id="referenceNumber" placeholder="文号" value="${taskNew.referenceNumber}"
                   class="form-control required">
        </div>
        <label class="col-sm-2 control-label no-padding-right" for="categoryId">事项类型</label>
        <div class="col-sm-3">
            <select name="categoryId" id="categoryId" class="form-control  required" onchange="changeCategory(this)">
                <option value="">点击选择</option>
                <option value="01" <c:if test="${taskNew.categoryId == '01'}">selected="selected"</c:if>>会议纪要</option>
                <%--<option value="02" <c:if test="${taskNew.categoryId == '02'}">selected="selected"</c:if>>省市县为民办实事</option>--%>
                <%--<option value="03" <c:if test="${taskNew.categoryId == '03'}">selected="selected"</c:if>>省市县政府工作报告</option>--%>
                <%--<option value="04" <c:if test="${taskNew.categoryId == '04'}">selected="selected"</c:if>>政协提案办理</option>--%>
                <%--<option value="05" <c:if test="${taskNew.categoryId == '05'}">selected="selected"</c:if>>其他事项</option>--%>
            </select>
        </div>
        <button class="btn btn-sm btn-success" id="addMetting" onclick="addMettings()">添加</button>
    </div>
    <%--会议纪要内容DIV--%>
    <div id="hyjyContent"></div>
    <div class="form-group">
        <label class="col-sm-2 control-label no-padding-right" for="content">任务内容</label>
        <div class="col-sm-8">
            <textarea rows="5" id="content" name="content" placeholder="任务内容" value="${taskNew.content}"
                      class="form-control"/>
        </div>
    </div>
    <div class="form-group">
        <label class="col-sm-2 control-label no-padding-right" for="leader">分管领导</label>
        <div class="col-sm-3">
            <input type="text" name="leader" id="leader" placeholder="分管领导" value="${taskNew.leader}"
                   class="form-control required">
        </div>
        <label class="col-sm-2 control-label no-padding-right" for="dateTime">任务时限</label>
        <div class="col-sm-3">
            <div class="input-group">
                <input type="text" name="dateTime" id="dateTime" placeholder="任务时限" value="${taskNew.dateTime}"
                       class="form-control date-picker required" readonly/>
                <span class="input-group-addon">
                    <i class="fa fa-calendar bigger-110"></i>
                </span>
            </div>
        </div>
    </div>
    <div class="form-group">
        <label class="col-sm-2 control-label no-padding-right" for="operator">督查人</label>
        <div class="col-sm-3">
            <input type="text" name="operator" id="operator" placeholder="督查人" value="${taskNew.operator}"
                   class="form-control required">
        </div>
        <label class="col-sm-2 control-label no-padding-right" for="operatorTel">督查人电话</label>
        <div class="col-sm-3">
            <input type="text" name="operatorTel" id="operatorTel" placeholder="督查人电话" value="${taskNew.operatorTel}"
                   class="form-control required" maxlength="11">
        </div>
    </div>
    <div class="form-group">
        <label class="col-sm-2 control-label no-padding-right">附件</label>
        <div class="col-sm-6">
            <input type="file" id="fileupload" name="files" class="form-control">
        </div>
        <div class="col-sm-2">
            <input type="button" value="上传" id="btn-upload" style="width: 100%; height: 32px;" class="btn-large btn-primary" />
            <input type="text" name="file" id="file" value="${taskNew.file}" class="form-control " style="display: none"/>
        </div>
    </div>

    <form:hidden path="sysId"/>

</form:form>
<script src="<s:url value="/assets/js/chosen.jquery.js"></s:url>"></script>
<script src="<s:url value="/assets/js/ajaxfileupload.js"></s:url>"></script>
<script src="<s:url value="/assets/js/modal/modal.js"></s:url>"></script>

<script type="text/javascript">
    jQuery(function ($) {
        $('.date-picker').datepicker({
            inline: true,
            format: "yyyy-mm-dd",
            autoclose: true,
            todayHighlight: true,
            language: 'cn'
        })
        //show datepicker when clicking on the icon
            .next().on(ace.click_event, function () {
            $(this).prev().focus();
        });
    });


    // 会议纪要的index
    var hyjyIndex = $("#hyjyContent .form-group").length;
    /**
     * 修改事项类型
     */
    function changeCategory(obj) {
        // 下拉框选中的text
        var text = $(obj).find('option:selected').text();
        if (text == null || text != '会议纪要') {
            $('#hyjyContent').empty();
            $("#addMetting").css("display","none");
            return;
        }
        $("#addMetting").css("display","block");
        addMettings();
    }

    /**
     * 增加会议纪要
     */
    function addMettings(){
        var remarkStr = 'list[' +  hyjyIndex + '].remark';
        var deptStr = 'list[' +  hyjyIndex + '].depart';
        html= '<div class="form-group">\n' +
            '    <label class="col-sm-2 control-label no-padding-right" for="' + remarkStr + '">议点</label>\n' +
            '    <div class="col-sm-3">\n' +
            '        <input type="text" name="' + remarkStr + '" id="' + remarkStr + '" placeholder="议点" \n' +
            '               class="form-control required" />\n' +
            '    </div>\n' +
            '    <label class="col-sm-2 control-label no-padding-right" for="' + deptStr + '">承办单位</label>\n' +
            '    <div class="col-sm-3">\n' +
            '        <select name="' + deptStr + '" id="' + deptStr + '" class="form-control required">\n' +
            '        </select>\n' +
            '    </div>\n' +
            '   <button class="btn-danger btn-sm">删除</button>\n' +
            '</div>';
        $('#hyjyContent').append(html);
        hyjyIndex++;
    }

    /**
     * 删除会议纪要
     */
    $("#hyjyContent").on("click",".btn-danger",function () {
        console.log(11);
        $(this).parent().remove();
    });

    /**
     * 上传附件
     */
    $("#btn-upload").click(function () {
        var fileval = $("#fileupload").val();
        if (fileval == null || fileval == "") {
            alert("未选择任何文件");
            return;
        }
        // 判断文件大小是否大于10M
        var fileSize = $("#fileupload")[0].files[0].size / 1024 / 1024;
        if (fileSize > 10) {
            alert("上传文件大小不能大于10M");
            return;
        }
        $(".shade").fadeIn(100);
        $(".warning").fadeIn(100);
        $('.la-square-jelly-box').show();
        showShade();
        //警告框自定义内容
        $('.warning>.title>em').html('加载中……');
        $.ajaxFileUpload({
            type: "post",
            fileElementId: "fileupload",
            secureuri: false,
            dataType: 'text',
            url: "/filesUpload/uploadBatch",
            // data:fileinfo,
            async: false,
            success: function (data) {
                var data = JSON.parse(data);
                console.log(data);
                var val = data.data.sysid;
                $("#file").attr("value", val);
                if (data.code === "200") {
                    $('.warning>.title>em').html('上传成功');
                } else {
                    $('.warning>.title>em').html('上传失败');
                }
            },
            error: function (data) {
                alert("附件上传失败 ！！请联系管理员");
            }
        });

    });
</script>
